<!-- @module approval-leave -->
<!-- @author: YunTao.Li -->
<!-- @description: 请假单审批页面 -->
<!-- @since: 2019-11-27 17:33:35 -->
<template>
  <div>
    <fieldset class="fieldset" style="margin:10px;">
      <legend class="legend-font" v-text="leave_form_text" />
      <el-form ref="leaveInputForm" :model="leaveInputForm" :label-position="labelPosition" label-width="120px" size="mini">
        <el-row :gutter="10">
          <!-- <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="INSCODE" prop="insCode">
              <el-input v-model="leaveInputForm.insCode" name="insCode" placeholder="INSCODE" />
            </el-form-item>
          </el-col> -->
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="组织名称" prop="orgCode">
              <OrgSelectTree ref="orgSelectRef" v-model="leaveInputForm.orgCode" :value="leaveInputForm.orgCode" name="orgCode" placeholder="组织机构" :disabled="true" @bindLabel="bindLabel" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="部门名称" prop="deptId">
              <el-input v-model="leaveInputForm.deptId" name="deptId" placeholder="部门名称" :disabled="true" />
            </el-form-item>
          </el-col>
          <!-- <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="工龄" prop="workYear">
              <el-input v-model="leaveInputForm.workYear" name="workYear" placeholder="工龄" />
            </el-form-item>
          </el-col> -->
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="申请单编码" prop="leaveCode">
              <el-input v-model="leaveInputForm.leaveCode" name="leaveCode" placeholder="自动生成" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="创建日期" prop="creationDate">
              <el-date-picker v-model="leaveInputForm.creationDate" style="width:100%;" type="date" name="creationDate" placeholder="创建日期" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="假期类型" prop="holidayType">
              <dictCombo v-model="leaveInputForm.holidayType" dicttypeid="holidayType" name="holidayType" placeholder="假期类型" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="开始日期" prop="startDate">
              <el-date-picker v-model="leaveInputForm.startDate" type="date" name="startDate" placeholder="开始日期" value-format="yyyy-MM-ddT00:00:00.000+0000" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="开始时段" prop="startTimeType">
              <dictCombo v-model="leaveInputForm.startTimeType" dicttypeid="timeTypeChose" name="startTimeType" placeholder="开始时段" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="请假天数" prop="days">
              <el-input v-model="leaveInputForm.days" name="days" placeholder="请假天数" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="结束日期" prop="endDate">
              <el-date-picker v-model="leaveInputForm.endDate" style="width:100%;" type="date" name="endDate" placeholder="结束日期" value-format="yyyy-MM-ddT00:00:00.000+0000" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="结束时段" prop="endTimeType">
              <dictCombo v-model="leaveInputForm.endTimeType" dicttypeid="timeTypeChose" name="endTimeType" placeholder="结束时段" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="联系电话" prop="telephone">
              <el-input v-model="leaveInputForm.telephone" name="telephone" placeholder="联系电话" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="紧急联系人" prop="contact">
              <el-input v-model="leaveInputForm.contact" name="contact" placeholder="紧急联系人" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="紧急联系人电话" prop="contactPhone">
              <el-input v-model="leaveInputForm.contactPhone" name="contactPhone" placeholder="联系电话" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="是否离京" prop="isLeaveBj">
              <dictCombo v-model="leaveInputForm.isLeaveBj" dicttypeid="yesOrNot" name="isLeaveBj" placeholder="是否离京" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="离京时间" prop="leaveTime">
              <el-input v-model="leaveInputForm.leaveTime" name="leaveTime" placeholder="离京时间" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
            <el-form-item label="回京时间" prop="backTime">
              <el-input v-model="leaveInputForm.backTime" name="backTime" placeholder="回京时间" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="18" :lg="18" :xl="18">
            <el-form-item label="去向" prop="position">
              <el-input v-model="leaveInputForm.position" name="position" placeholder="去向" type="textarea" rows="2" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
            <el-form-item label="请假事由" prop="leaveDesc">
              <el-input v-model="leaveInputForm.leaveDesc" name="leaveDesc" placeholder="请假事由" :disabled="true" style="width:80%" type="textarea" rows="4" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </fieldset>

    <!--file begin-->
    <fileUpload :param-pa-doc-id="leaveInputForm.fileParamPaDocId" :disable-upload-button="true" :disable-delete-button="true" />
    <!--file end-->

    <div slot="footer" class="dialog-footer" style="margin:10px;text-align: center">
      <!-- <el-button type="warning" @click="onLoadLeave">加载待审批的出差单</el-button> -->
      <el-button type="success" @click="onApproved">审批通过</el-button>
      <el-button type="danger" @click="onUnApproved">审批驳回</el-button>
    </div>
  </div>

</template>

<script>
import { getLeaveInfoForApproval, approveLeave, approveLeaveDisagree } from '@/api/attendance/approval-service'
import OrgSelectTree from '@/views/attendance/components/combo/org-tree-select.vue'
import dictCombo from '@/views/attendance/components/combo/dict-comb'
import fileUpload from '@/views/attendance/components/fileupload'

export default {
  components: { OrgSelectTree, dictCombo, fileUpload },
  data() {
    return {
      labelPosition: 'right',
      leave_form_text: '请假单信息',
      leaveInputForm: {
        fileParamPaDocId: '',
        leaveId: '',
        ouId: '',
        orgCode: '',
        orgName: '',
        deptId: '',
        workYear: '',
        leaveCode: '',
        insCode: '',
        taskId: '',
        creationDate: new Date(),
        holidayType: '',
        startDate: new Date(),
        startTimeType: '',
        days: '',
        endDate: new Date(),
        endTimeType: '',
        telephone: '',
        contact: '',
        contactPhone: '',
        isLeaveBj: '',
        leaveTime: '',
        backTime: '',
        position: '',
        leaveDesc: ''
      },
      formLabelWidth: '120px'
    }
  },
  created() {
    // 接收从待办跳转带过来的待办参数
    const processInstID = localStorage.getItem('processInstID')
    this.leaveInputForm.insCode = processInstID

    this.leaveInputForm.leaveCode = ''
  },
  mounted() {
    this.onLoadLeave()
  },
  methods: {
    bindLabel(orgCode, label) {
      if (orgCode && orgCode !== '') {
        this.leaveInputForm.orgCode = orgCode
      }

      if (label && label !== '') {
        this.leaveInputForm.orgName = label
      }
    },
    onLoadLeave() { // 获得数据
      const insCode = this.leaveInputForm.insCode
      var _this = this
      getLeaveInfoForApproval(insCode).then(response => {
        this.leaveInputForm = response.data
        const taskId = localStorage.getItem('taskId')
        this.leaveInputForm.taskId = taskId

        //* ***file begin */
        _this.leaveInputForm.fileParamPaDocId = _this.leaveInputForm.leaveId
        /** **file end */
      })
    },
    onUnApproved() { // 审批驳回
      const leaveId = this.leaveInputForm.leaveId
      const data = this.leaveInputForm

      this.$confirm('确定要驳回审批么?', '确认', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async() => {
        approveLeaveDisagree(leaveId, data).then(response => {
          if (response.code === 200) {
            this.$message({ type: 'success', message: '审批驳回成功!' })
            setTimeout(() => {
              this.$router.go(-1)
            }, 500)
          } else {
            this.$message.error(response.message)
          }
        })
      }).catch(err => { console.error(err) })
    },
    onApproved() { // 审批通过
      const leaveId = this.leaveInputForm.leaveId
      const data = this.leaveInputForm

      this.$confirm('确定要通过审批么?', '确认', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async() => {
        approveLeave(leaveId, data).then(response => {
          if (response.code === 200) {
            this.$message({ type: 'success', message: '审批成功!' })
            setTimeout(() => {
              this.$router.go(-1)
            }, 500)
          } else {
            this.$message.error(response.message)
          }
        })
      }).catch(err => { console.error(err) })
    }
  }
}
</script>

<style>

</style>
